import {computed, defineComponent,h} from "vue";
import {svgProps} from "./type";
import './index.less'

const props = svgProps();

const SvgIcon = defineComponent({
    name:'SvgIcon',
    props,
    setup(props,cxt){
        const {className,title,prefix} = props

        const symbolId = computed(()=> `#${prefix}-${title}`)
        const svgClass = computed(()=>{
            if(className){
                return `svg-icon ${className}`
            }
            return 'svg-icon'
        })
        return ()=>(
            <>
                <svg class={svgClass.value} aria-hidden="true">
                    <use href={symbolId.value} />
                </svg>
            </>
        )
    }
})

export default SvgIcon
